<!DOCTYPE html>
<html lang="en">

<head>
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<style>
    div {
        width: 5.3333rem;
        height: 5.3333rem;
        padding: .5333rem;
        background-color: aqua;
        border: 10px solid red;
        margin: 10px 10px;
    }
</style>
<script src="jquery.min.js"></script>
</head>

<body>
<div></div>
  <script>
$(function(){/* 获取设置元素的宽度，高度 */
       console.log($("div").width());
       // $("div").width(600);
       // 只算宽高
       //2.innerWidth();宽高+padding;
       console.log($("div").innerWidth());
//3.width/height+padding+border
console.log(("div").outerWidth());
//4.width/height+padding+border+margin;(里面加true)
console.log(("div").outerWidth(true));
//()为空获取的是数字
//()不空获取的是赋值，修改里面的值
//参数可以为空
   });
  </script>
</body>
</html>